/**
 * Created by sunyan on 2017/6/14.
 */

/**
 *
 * 鼠标滑动改变层级关系
 *
 * **/

let changeLevel = {
  change(){
    const that = this
    document.onmousemove = function (e) {
      e = e || window.event;
      let x = e.clientX+document.body.scrollLeft + document.documentElement.scrollLeft,
        y = e.clientY+document.body.scrollTop + document.documentElement.scrollTop;
      let originX = document.body.scrollWidth/2,
        originY = parseInt(getComputedStyle(document.getElementById('box')).marginTop) + 320;
      let critical1 = 130,
        critical2 = 300;
      let radiusX = Math.abs(x-originX),
        radiusY = Math.abs(y-originY);
      let level3 = document.getElementById('level3'),
        labels = document.getElementById('labels'),
        descList = document.getElementById('descList');

      let squaresSum = Math.pow(radiusX,2) + Math.pow(radiusY,2);
      if( squaresSum > Math.pow(critical2,2) ){ //描述层在最上面
        // alert('11')
        that.removeIndexClass(level3,'svg-level-3')
        that.removeIndexClass(labels,'labels')
        that.addIndexClass(descList,'descList')
      }
      if( squaresSum < Math.pow(critical2,2) && Math.pow(critical1,2) < squaresSum){ //分类层在最上面
        // alert('22')
        that.removeIndexClass(level3,'svg-level-3')
        that.addIndexClass(labels,'labels')
        that.removeIndexClass(descList,'descList')
      }
      if( squaresSum < Math.pow(critical1,2) ) {  //扇形层在最上面
        // alert('33')
        that.addIndexClass(level3,'svg-level-3')
        that.removeIndexClass(labels,'labels')
        that.removeIndexClass(descList,'descList')
      }

    }
  },
  addIndexClass(dom,oldClass){
    dom.setAttribute('class',oldClass+ ' maxIndex')
  },
  removeIndexClass(dom,oldClass){
    dom.setAttribute('class',oldClass)
  }

}
module.exports = {changeLevel}


